@import '@snack-uikit/figma-tokens/build/scss/styles-theme-variables';

.wrapper {
  resize: horizontal;

  overflow: auto;

  width: 584px;
  min-width: 150px;
  padding: 20px;

  background-color: $sys-neutral-background;
  border: 1px solid $sys-neutral-decor-default;
  border-radius: $dimension-050m;

  &[data-outline]{
    background-color: $sys-neutral-background1-level;
  }
}

.scrollWrapper {
  margin-top: 24px;
}

.scroll {
  max-height: 300px;
}

.container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.card {
  border: solid 1px $sys-primary-decor-default;
  border-radius: 4px;
}